<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">
<ui:composition template="template.xhtml">
	<ui:define name="content">
		<h:form id="form01">
			<p:panel header="Ward List" style="text-align:center">
				<div style="float: left">
					<p:commandButton id="addNewBtn" ajax="true" value="Add New Ward"
						actionListener="#{wardListControler.startAddWard}"
						icon="ui-icon-plus" update=":form04:detailDialog" />

					<p:commandButton ajax="true"
						value="#{dictionaryControler.dictionary['Edit ward condition']}"
						actionListener="#{wardListControler.startEditCondition}"
						icon="ui-icon-pencil" update=":form04:editConditionDialog" />
				</div>
				<br />
				<br />
				<br />
				<p:dataTable id="wardTable" widgetVar="widgetVar_w"
					filteredValue="#{wardListControler.filteredTerms}"
					rendered="#{mainMenuControler.hasUserRole('admin') || mainMenuControler.hasUserRole('ward')}"
					value="#{wardListControler.wardList}" var="ward" rows="15"
					paginator="true" paginatorAlwaysVisible="true"
					paginatorPosition="bottom" first="#{wardListControler.first}"
					paginatorTemplate="{PreviousPageLink} {CurrentPageReport} {NextPageLink}">
					<p:column style="width:20%"
						headerText="#{dictionaryControler.dictionary['Name']}">
						<h:outputText value="#{ward.name}" />
					</p:column>

					<p:column style="width:4%"
						headerText="#{dictionaryControler.dictionary['floor']}">
						<h:outputText value="#{ward.floor}">
						</h:outputText>
					</p:column>

					<p:column style="width:4%"
						headerText="#{dictionaryControler.dictionary['Department']}">
						<h:outputText value="#{ward.departmentName}">
						</h:outputText>
					</p:column>

					<p:column style="width:4%"
						headerText="#{dictionaryControler.dictionary['Building']}">
						<h:outputText value="#{ward.buildingName}">
						</h:outputText>
					</p:column>

					<p:column style="width:4%"
						headerText="#{dictionaryControler.dictionary['Bed']} #{dictionaryControler.dictionary['Count']}">
						<h:outputText value="#{ward.bedCount}">
						</h:outputText>
					</p:column>

					<p:column style="width:3%"
						rendered="#{mainMenuControler.hasUserRole('admin')}"
						headerText="#{dictionaryControler.dictionary['Edit']}">
						<p:commandButton id="editButton" update=":form04:detailDialog_1"
							action="#{wardListControler.startEditWard}" icon="ui-icon-pencil">
							<f:setPropertyActionListener value="#{ward}"
								target="#{wardListControler.selectedWard}" />
						</p:commandButton>
					</p:column>
					<p:column style="width:3%"
						rendered="#{mainMenuControler.hasUserRole('admin')}"
						headerText="#{dictionaryControler.dictionary['Delete']}">
						<p:commandButton id="deleteButton" ajax="true"
							action="#{wardListControler.deleteWard}"
							update=":form01:wardTable" icon="ui-icon-close" oncomplete="PF('widgetVar_w').clearFilters();"
							style="margin-right:5px">
							<f:setPropertyActionListener value="#{ward}"
								target="#{wardListControler.selectedWard}" />
							<p:confirm
								header="#{dictionaryControler.dictionary['Confirmation']}"
								message="#{dictionaryControler.dictionary['Are you sure']}?"
								icon="ui-icon-alert" />
						</p:commandButton>
					</p:column>
				</p:dataTable>
			</p:panel>
			<h:outputText value="Access Denied, please contact the administrator"
				rendered="#{!(mainMenuControler.hasUserRole('admin') || mainMenuControler.hasUserRole('ward'))}"
				style="width:100%; height:50%; text-align:center;
				font-size:150% !important;position:absolute; margin-left:0;
				 margin-right:0; margin-top:0;margin-bottom:0" />
		</h:form>
	</ui:define>

	<ui:define name="dialog">
		<h:form id="form04">
			<p:dialog id="detailDialog" widgetVar="detailDialog_w" modal="true"
				showEffect="fade" resizable="false" draggable="true"
				closable="false" visible="#{wardListControler.addMode}"
				header="#{dictionaryControler.dictionary['Ward']} #{dictionaryControler.dictionary['Add']}">
				<p:focus context="detailDialog" for="addBtn" />
				<h:panelGrid columns="2">
					<h:outputText value="#{dictionaryControler.dictionary['Building']}" />
					<p:selectOneMenu id="buildingCombo" style="width:98%"
						value="#{wardListControler.createWardWizard.buildingKey}"
						rendered="#{wardListControler.addMode}">
						<f:selectItems var="building"
							value="#{buildingListControler.baseBuildingList}"
							itemLabel="#{building.name}" itemValue="#{building.key}" />
					</p:selectOneMenu>

					<h:outputText
						value="#{dictionaryControler.dictionary['Department']}" />
					<p:selectOneMenu id="departmentCombo"
						rendered="#{wardListControler.addMode}"
						value="#{wardListControler.createWardWizard.departmentSeq}"
						style="width:98%">
						<f:selectItems
							value="#{departmentListControler.baseDepartmentList}"
							var="department" itemLabel="#{department.name}"
							itemValue="#{department.seq}" />
					</p:selectOneMenu>

					<h:outputText
						value="#{dictionaryControler.dictionary['Floor Number']}" />
					<p:inputText value="#{wardListControler.createWardWizard.floor}"
						required="true" rendered="#{wardListControler.addMode}"
						requiredMessage="#{dictionaryControler.dictionary['Floor Number']} #{dictionaryControler.dictionary['Required']}" />

					<h:outputText
						value="#{dictionaryControler.dictionary['Number of wards']}" />
					<p:inputText
						value="#{wardListControler.createWardWizard.wardCount}"
						rendered="#{wardListControler.addMode}"
						requiredMessage="#{dictionaryControler.dictionary['Number of wards']} #{dictionaryControler.dictionary['Required']}" />

					<h:outputText
						value="#{dictionaryControler.dictionary['Ward Name Prefix']}" />
					<p:inputText
						value="#{wardListControler.createWardWizard.wardPrefix}"
						maxlength="30" rendered="#{wardListControler.addMode}" />

					<h:outputText
						value="#{dictionaryControler.dictionary['Ward Index Length']}" />
					<p:inputText
						value="#{wardListControler.createWardWizard.wardIndexLength}"
						required="true" rendered="#{wardListControler.addMode}"
						requiredMessage="#{dictionaryControler.dictionary['Ward Index Length']} #{dictionaryControler.dictionary['Required']}" />

					<h:outputText
						value="#{dictionaryControler.dictionary['Ward Start Index']}" />
					<p:inputText
						value="#{wardListControler.createWardWizard.wardStartIndex}"
						required="true" rendered="#{wardListControler.addMode}"
						requiredMessage="#{dictionaryControler.dictionary['Ward Start Index']} #{dictionaryControler.dictionary['Required']}" />

					<h:outputText
						value="#{dictionaryControler.dictionary['Number of beds']}" />
					<p:inputText value="#{wardListControler.createWardWizard.bedCount}"
						required="true" rendered="#{wardListControler.addMode}"
						requiredMessage="#{dictionaryControler.dictionary['Number of beds']} #{dictionaryControler.dictionary['Required']}" />

					<h:outputText
						value="#{dictionaryControler.dictionary['Bed Name Prefixs']}" />
					<p:inputText
						value="#{wardListControler.createWardWizard.bedPrefix}"
						rendered="#{wardListControler.addMode}" />


					<h:outputText
						value="#{dictionaryControler.dictionary['Extra Info']}" />
					<p:inputText
						value="#{wardListControler.createWardWizard.extraInfo}"
						rendered="#{wardListControler.addMode}" />
				</h:panelGrid>

				<br />

				<h:dataTable style="width:250px"
					value="#{wardListControler.createWardWizard.conditions}"
					var="condition" rendered="#{wardListControler.addMode}">
					<p:column>
						<p:selectBooleanCheckbox value="#{condition.condition}" />
					</p:column>
					<p:column>
						<h:outputText value="#{condition.term}" />
					</p:column>
				</h:dataTable>
				<br />
				<div style="text-align: right">
					<p:commandButton id="addBtn"
						value="#{dictionaryControler.dictionary['Add']}" ajax="true"
						style="margin-right:5px" oncomplete="PF('widgetVar_w').clearFilters();"
						actionListener="#{wardListControler.addNewWard}"
						update="detailDialog,:form01:wardTable" />
					<p:commandButton id="cancelBtn"
						value="#{dictionaryControler.dictionary['Cancel']}" ajax="true"
						actionListener="#{wardListControler.cancelAddWard}"
						immediate="true" update="detailDialog" />
				</div>
				<p:messages showDetail="false" />
			</p:dialog>
			<p:dialog id="detailDialog_1" widgetVar="detailDialog_e"
				resizable="false" draggable="true" closable="false"
				visible="#{wardListControler.editMode}" modal="true"
				header="#{dictionaryControler.dictionary['Ward']} #{dictionaryControler.dictionary['Edit']}">
				<p:panelGrid columns="2">
					<h:outputText value="#{dictionaryControler.dictionary['Name']}" />
					<p:inputText value="#{wardListControler.selectedWard.name}"
						maxlength="30" required="true"
						rendered="#{wardListControler.editMode}"
						requiredMessage="#{dictionaryControler.dictionary['Name']} #{dictionaryControler.dictionary['Required']}" />
				</p:panelGrid>
				<br />
				<div style="text-align: right">
					<p:commandButton id="saveBtn_1"
						value="#{dictionaryControler.dictionary['Save']}" ajax="true"
						style="margin-right:5px"
						action="#{wardListControler.saveEditWard}"
						update=":form01:wardTable,detailDialog_1" />
					<p:commandButton id="cancelBtn_1"
						value="#{dictionaryControler.dictionary['Cancel']}" ajax="true"
						action="#{wardListControler.cancelEditWard}" immediate="true"
						update="detailDialog_1" />
				</div>
				<p:messages />
			</p:dialog>
			<p:dialog id="editConditionDialog" widgetVar="detailDialog_c"
				resizable="false" draggable="true" closable="false"
				visible="#{wardListControler.editConditionMode}" modal="true"
				header="#{dictionaryControler.dictionary['Ward Condition']} #{dictionaryControler.dictionary['Edit']}">
				<p:dataTable id="conditionTable" style="width:250px"
					value="#{wardListControler.conditionList}" var="condition"
					rendered="#{wardListControler.editConditionMode}">
					<p:column headerText="Condition">
						<h:outputText value="#{condition.term}" />
					</p:column>
					<p:column headerText="#{dictionaryControler.dictionary['Delete']}">
						<p:commandButton ajax="true"
							action="#{wardListControler.deleteCondition}"
							update="conditionTable" icon="ui-icon-close"
							style="margin-right:5px">
							<f:setPropertyActionListener value="#{condition}"
								target="#{wardListControler.selectedCondition}" />
							<p:confirm
								header="#{dictionaryControler.dictionary['Confirmation']}"
								message="#{dictionaryControler.dictionary['Are you sure']}?"
								icon="ui-icon-alert" />
						</p:commandButton>
					</p:column>
					<f:facet name="footer">
						<p:inputText value="#{wardListControler.newCondition.term}"  style="width:50%;margin-right:5px"/>
						<p:commandButton ajax="true"
							action="#{wardListControler.addCondition}"
							update="conditionTable,:form04:conditionMsg" icon="ui-icon-plus"
							/>
					</f:facet>
				</p:dataTable>
				<p:messages id="conditionMsg"/>
				<br />
				<div style="text-align: right">
					<p:commandButton value="#{dictionaryControler.dictionary['Save']}"
						ajax="true" style="margin-right:5px"
						action="#{wardListControler.saveEditCondition}"
						update="editConditionDialog" />
					<p:commandButton
						value="#{dictionaryControler.dictionary['Cancel']}" ajax="true"
						action="#{wardListControler.cancelEditCondition}" immediate="true"
						update="editConditionDialog" />
				</div>
				<p:messages />
			</p:dialog>
		</h:form>
	</ui:define>
</ui:composition>
</html>
